<template>
	<div class="main">
		<Banner :ba_list='banner_list'></Banner>
		<Cons :cons_list='conslist'></Cons>
		<Meun :meun_list='meunlist'></Meun>
		<Spike :propspike='spikeList'></Spike>
		<Grass :grass_list='grasslist'></Grass>
		<Waterfall></Waterfall>
		<UserHB></UserHB>
		<!-- 底部菜单 -->
		<BottomNav pages=1></BottomNav>
	</div>
</template>

<script>
	import Banner from './pages/Banner'
	import Cons from './pages/Cons'
	import Meun from './pages/Meun'
	import Spike from './pages/Spike.vue'
	import Grass from './pages/Grass.vue'
	import UserHB from './pages/UserHB.vue'
	import Waterfall from './pages/Waterfall.vue'
	import BottomNav from '../default/BottomNav.vue'
	export default{
		name:'Home',
		components:{
			Banner,
			Cons,
			Meun,
			Spike,
			Grass,
			Waterfall,
			UserHB,
			// 底部菜单
			BottomNav
		},
		data() {
			return{
				banner_list:[],
				conslist:[],
				meunlist:[],
				spikeList:[],
				grasslist:[]
			}
		},
		created() {
			this.axios.get("./api/dataHome.json").then((res)=>{
				let that = this;
				let data = res.data.Homemsg[0]
				this.banner_list=data.Bannerlist
				this.conslist=data.Conslist
				this.meunlist=data.Meunlist
				this.spikeList=data.SpikeVueList
				this.grasslist=data.Grasslist
			}).catch((error)=>{
				console.log(error)
			})
		}
	}
</script>

<style scoped>
	/* 使用深选择器在父组件中修改子组件的样式 */
	.main /deep/ .nava{
		margin:  0 auto;
		width: 95%;
		height: 1.3rem;
		background-color: #dedede;
	}
</style>
